import { Component, OnInit } from '@angular/core';

// 引入服务，在哪里用，还要再次引用服务
import {StorageService} from '../../services/storage.service'

@Component({
  selector: 'app-todolist',
  templateUrl: './todolist.component.html',
  styleUrls: ['./todolist.component.css']
})
export class TodolistComponent implements OnInit {
  // 代办事项 数组，一个名称，一个checked
  public event:any[]=[
    {name:"事项1",checked:false},
    {name:"事项2",checked:true},
    {name:"事项3",checked:true},
    {name:"事项4",checked:true}
  ];

  // 添加的代办事项
  public event2:any="";

  constructor(public storage:StorageService) {
    // console.log(storage)
   }

  ngOnInit() {
    // 刷新就会调用它
    // 从浏览器里拿
    var eventlist:any= this.storage.get("eventlist")
    if(eventlist)
    {
      this.event=eventlist
    }
  }

  // 添加方法
  add(){
    this.event.push({name:this.event2,checked:false})

    // 数据持久化
    this.storage.set("eventlist",this.event)

    this.event2=""
  }

  // 添加方法 点击enter
  add2(e){
    // console.log(e.keyCode)            
    if(e.keyCode==13&&this.event2!=""){
      if(!this.todolistHasKeyWord(this.event,this.event2)) // 不存在关键词
      {
        this.event.push({name:this.event2,checked:false})

        // 数据持久化
        this.storage.set("eventlist",this.event)

        this.event2=""
      }else{ // 存在关键词
        alert("数据不能为空或数据已经存在")
        this.event2=""
      }
      
    }
  }

  // 删除方法
  delete(key){
    // console.log(key)
    this.event.splice(key,1)
    // 数据持久化
    this.storage.set("eventlist",this.event)
  }

  // 因为 even2 是一个数组，里面存的对象，直接用 indexOf 是无法判断是否存的的
  // 新建一个方法来判断
  // 如果数组里面存在 keyword 返回 true，否则返回 false
  todolistHasKeyWord(event:any,event2:any){

    // 异步 会存在问题
    // todolist.array.forEach(item => {
    //   if(item.name==keyword){
    //     return true
    //   }
    // });

    if(!event2) return false

    for(var i=0;i<event.length;i++){
      if(event[i].name==event2){
        return true
      }
    }
    return false
  }

  checkboxchange(){
    console.log("改变了")
    // 数据持久化
    this.storage.set("eventlist",this.event)
  }
}
